<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>
        创建用户
        <small></small>
    </h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
        <li><a href="#">表单</a></li>
        <li class="active">表单提交</li>
    </ol>
</section>

<!-- Main content -->
<section class="content">
    <div class="box box-primary">
        <div class="box-header with-border">
            <h3 class="box-title">信息创建</h3>
        </div>
        <!-- /.box-header -->
        <!-- form start -->
        <form role="form" id="myForm" class="form-horizontal">
            <div class="box-body">
                <div class="form-group has-success">
                    <label for="inputText1" class="col-sm-2 control-label">邮箱</label>

                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="inputText1" placeholder="文本框" name="text">
                        <span class="help-block">成功提示</span>
                    </div>
                </div>
                <div class="form-group has-error">
                    <label for="inputPassword3" class="col-sm-2 control-label">密码</label>

                    <div class="col-sm-10">
                        <input type="password" class="form-control" id="inputPassword3" placeholder="密码"
                               name="password">
                        <span class="help-block">错误提示</span>
                    </div>
                </div>
                <div class="form-group has-warning">
                    <label for="exampleInputFile" class="col-sm-2 control-label">上传文件</label>

                    <div class="col-sm-10">
                        <input type="file" class="form-control" id="exampleInputFile" placeholder="密码" name="file">
                        <span class="help-block">提示信息</span>
                    </div>
                </div>
                <div class="form-group">
                    <label for="inputPassword3" class="col-sm-offset-2 col-sm-10 help-block">静态文本</label>
                </div>
                <!-- textarea -->
                <div class="form-group">
                    <label class="col-sm-2 control-label">文本域</label>

                    <div class="col-sm-10">
                        <textarea class="form-control" rows="3" placeholder="输入 ..." name="textarea"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">只读文本域</label>

                    <div class="col-sm-10">
                        <textarea class="form-control" rows="3" placeholder="输入 ..." disabled></textarea>
                    </div>
                </div>
                <!--多选-->
                <div class="form-group">
                    <label class="col-sm-2 control-label">多选框</label>

                    <div class="col-sm-10">
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" name="optionsCheckbox1">
                                多选框 1
                            </label>
                        </div>

                        <div class="checkbox">
                            <label>
                                <input type="checkbox" name="optionsCheckbox2">
                                多选框 2
                            </label>
                        </div>

                        <div class="checkbox">
                            <label>
                                <input type="checkbox" name="optionsCheckbox3" disabled>
                                多选框 disabled
                            </label>
                        </div>
                    </div>
                </div>

                <!-- 单选 -->
                <div class="form-group">
                    <label class="col-sm-2 control-label">单选框</label>

                    <div class="col-sm-10">
                        <div id="gender2" class="btn-group" data-toggle="buttons">
                            <label class="btn btn-default" data-toggle-class="btn-primary" data-toggle-passive-class="btn-default">
                                <input type="radio" name="gender" value="male"> &nbsp; Male &nbsp;
                            </label>
                            <label class="btn btn-primary active" data-toggle-class="btn-primary" data-toggle-passive-class="btn-default">
                                <input type="radio" name="gender" value="female" checked=""> Female
                            </label>
                        </div>
                    </div>
                </div>

                <!-- select -->
                <div class="form-group">
                    <label class="col-sm-2 control-label">下拉选择</label>

                    <div class="col-sm-10">
                        <select class="form-control" name="select">
                            <option>option 1</option>
                            <option>option 2</option>
                            <option>option 3</option>
                            <option>option 4</option>
                            <option>option 5</option>
                        </select>
                    </div>
                </div>
            </div>
            <!-- /.box-body -->

            <div class="box-footer">
                <button type="submit" class="btn btn-default">取消</button>
                <button type="submit" class="btn btn-primary pull-right">创建</button>
            </div>

            <div id="divToUpdate"></div>
        </form>
    </div>
</section>
<!-- /.content -->

<script>
    //  var options={
    //
    //    url:url,　　　　　　//form提交数据的地址
    //
    //    type:type,　　　  //form提交的方式(method:post/get)
    //
    //    target:target,　　//服务器返回的响应数据显示在元素(Id)号确定
    //
    //    beforeSubmit:function(),　　//提交前执行的回调函数
    //
    //    success:function(),　　　　   //提交成功后执行的回调函数
    //
    //    dataType:null,　　　　　　　//服务器返回数据类型
    //
    //    clearForm:true,　　　　　　 //提交成功后是否清空表单中的字段值
    //
    //    restForm:true,　　　　　　  //提交成功后是否重置表单中的字段值，即恢复到页面加载时的状态
    //
    //    timeout:6000 　　　　　 　 //设置请求时间，超过该时间后，自动退出请求，单位(毫秒)。　　　　　　
    //
    //  }
    $("#myForm").ajaxForm({
        url: './wwwroot/data/objects_deep.txt',
        beforeSubmit: function (data, $el) {
//    console.log(JSON.stringify(data,true," "))
            alert("提交数据.");
        },
        success: function (data, state, obj) {
//    console.log(data)
            USEN.successAlert({
                title:"提示:",
                content:'提交成功,刷新Table组件'
//                type:"fail"
            });
            //刷新table页面中的列表
            var table = USEN.getDatatable("myTable");
            if (table.context.length > 0) table.ajax.reload();
            //关闭当前TAB
            USEN.closeActiveTab();
        }
    })
</script>
